
*{
	margin: 0;
	padding: 0;
}
li{
	list-style: none;
}
a{
	text-decoration: none;
}
.head{
	width: 100%;
	height: 70px;
	background: rgba(255,255,255,.55);
	position: fixed;
	top: 0;
	right: 0;
	z-index: 999;
}
.header{
	width: 80%;
	height: 70px;

/*	margin-left: 15%;*/
	float: right;
	background: transparent;
}
.logo{
	height: 70px;
}
.logo img{
	margin-top: 7px;
}
.fl{float: left;}
.fr{float: right;}
.nav ul li{
	float: left;
	height: 70px;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
	position: relative;
}
.nav-one{
	display: block;
	height: 30px;
	line-height: 30px;
	margin-top: 20px;
	overflow: hidden;
	-webkit-transition: all .4s ease-out;
	-moz-transition: all .4s ease-out;
	-ms-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
	transition: all .4s ease-out;	
}
.header .nav ul .tu{
	padding: 0;
	background: rgb(58,54,87);
}
.nav ul li a{
	display: block;
	color: #777;
	padding: 0 15px;
	font-size: 18px;
	font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
	text-align: center;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;
}
:hover .en{
	color: #fff;
	
}
.nav ul li:hover{
	background: rgb(58,54,87);
}
.nav ul li:hover .nav-one a{
	-webkit-transform: translateY(-30px);
	-moz-transform: translateY(-30px);
	-ms-transform: translateY(-30px);
	-o-transform: translateY(-30px);
	transform: translateY(-30px);
	
}

.meum-sub{
	position: absolute;
	top: 70px;
	left: 0;
	width: 150%;
	z-index: 999;
	background: rgb(58,54,87);
	border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding-bottom: 10px;
    -webkit-transform: rotateX(-99deg);
	-moz-transform: rotateX(-99deg);
	-ms-transform: rotateX(-99deg);
	-o-transform: rotateX(-99deg);
    transform: rotateX(-99deg);
    -webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    -webkit- transform-origin: 0px 0px;
	-moz- transform-origin: 0px 0px;
	-ms- transform-origin: 0px 0px;
	-o- transform-origin: 0px 0px;
    transform-origin: 0px 0px;
}
.nav ul li:hover .meum-sub{
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	-o-transform: rotateX(0deg);
	transform: rotateX(0deg);
}
.nav ul li .meum-sub a{
	text-align: left;
	color: #fff;
	height: 35px;
	font-size: 14px;
	line-height: 35px;
	
}
.nav ul li .meum-sub a:hover{
	border-left: 2px solid rgb(58,54,87);
	box-sizing: border-box;
	color: rgb(58,54,87);
	background: #fff;
}

/*#slide1{
	background: url(../img/banner-1.png) no-repeat center;
	background-size: 100% auto;
	z-index: -10;
}
#slide2{
	background: url(../img/banner-2.png) no-repeat center;
	background-size: 100% auto;
	z-index: -10;
}*/
#section1{
	position: relative;
}
#section1 .slide img{
	width: 100%;
	height: auto;
}


/*.slide-li{
	position: absolute;
	top: 50%;
	left: 20%;
	height: 20px;
	width: 30px;
	z-index: 988;
}
.slide-list{
	height: 8px;
	width: 8px;
	border-radius: 50%;
	float: left;
	margin-left: 3px;
	background: #999;
	margin: 5px auto 5px 5px;
	cursor: pointer;
}
.slide-list-color{
	background: #f00;
}*/


.product{
	width: 70%;
	height: 100%;
	margin:  0 auto;
	padding-top: 90px;
}
#section2 .pro-title{
	display: block;
	width: 160px;
	margin: 0 auto;
	font-size: 20px;
	padding: 10px;
	text-align: center;
	border-bottom: 2px solid #000;
}
#section2 .product p{
	width: 110px;
	color: #777;
	font-family: "微软雅黑";
	font-size: 12px;
	text-align: center;
	margin: 8px auto 0 auto;
}
.pro-btn{
	width: 180px;
	height: 40px;
	font-size: 16px;
	cursor: pointer;
	background: #FFFFFF;
	border-radius: 50px;
	float: right;
	outline: none;
	margin-top: 10px;
	transition: all .3s ease-out; 
	border: 1px solid #999;
}
.pro-btn:hover{
	background: rgb(16,236,192);
	border: none;
	color: #fff;
}
.clr{
	clear: both;
	zoom: 1;
}
.pro-li{
	display: block;	
	float: left;
	width: 32%;
	height: auto;
	text-align: center;
	padding-bottom: 15px;
	margin-top: 20px;
}
#section2 .pro-li:hover{
	
	
	background: url(../img/bg.png) no-repeat center;
	/*box-shadow: -5px -5px 5px rgba(147,147,147,.15);*/
}
#section2 .pro-li img:hover .pro-li{
	box-shadow: 5px 5px  5px rgba(147,147,147,.15);
}
#section2 .pro-2,#section2 .pro-3{
	margin-left: 1.5%;
}
#section2 .pro-li a{
	display: inline-block;
	text-align: center;
	width:100%;
	height: inherit;
}
.pro-li img{
	height: 200px;
}
.pro-li .pro-p{
	width: 30px;	
}
#section2 .pro-li .pro-p p{
	margin: 0 auto;
}
#section2 .pro-li .p-cn{
	font-size: 18px;
}
.swich{
	margin-top: 50px;
}
.swich form{
	margin: 0 auto;
	/*height: 35px;*/
	width: 505px;
	position: relative;
	border: 1px solid #777;
	border-radius:50px;
}
.swich input{
	height: 35px;
	width: 425px;
	border: none;
	margin-left: 15px;
	font-size: 18px;
	color: #b9b9b9;
	outline: none;
}
.swich button{
	position: absolute;
	height: 35px;
	width: 66px;
	cursor: pointer;
	background: #fff;
	border-top: none;
	border-right: none;
	border-bottom: none;
	border-left: 1px solid #777;
	outline: none;
	right: px;
	top: 0;
	background: url(../img/swich.png) no-repeat center;
}
.swich button:hover{
	background: url(../img/swich1.png) no-repeat center;
}
#section3{
	background: url(../img/slider3.png) no-repeat center;
	background-size: 100% auto;
	
}
#section3 .service{
	position: relative;
	width: 70%;
	margin: 0 auto;
	height: inherit;
}
.service .bottom-div{
	position: absolute;	
	width: 100%;
	bottom: 5%;
}
.service .service-li{
	position: relative;
	float: left;
	width: 26%;
	height: 250px;
	margin-left: 6%;
	cursor: pointer;
}
.service .service-li:nth-child(3){
	margin-left: 10%;
	padding-top: 50px;
}
.service-sub{
	position: absolute;
	height: 70%;
	width: 100%;
	margin-top: 100px;
	display: inline-block;
	/*left: -100%;*/
	/*transform: translateX(-100%) , translateY(-100%);*/
	/*display: none;*/
}
.service .service-sub1{
	opacity: 0;
	background: url(../img/bg1.png) no-repeat center;
	background-size: 100% auto;
	transform: translateX(-100%);
	transition: all .3s ease-out;	
}
.service .service-sub2{
	opacity: 0;
	background: url(../img/bg2.png) no-repeat center;
	background-size: 100% auto;
	transform: translateX(-100%);
	transition: all .3s ease-out;
	
}
.service .service-sub3{
	opacity: 0;
	background: url(../img/bg3.png) no-repeat center;
	background-size: 100% auto;
	transform: translateX(-100%);
	transition: all .3s ease-out;
}
.service .service-li1:hover .service-sub1{
	display: block;
}
.service-sub .sub-close{
	position: absolute;
	width: 30px;
	height: 30px;
	top: 0;
	right: 0;
	cursor: pointer;
	background: url(../img/close1.png) no-repeat center;
	z-index: 9900;
}
.service-sub .sub-close:hover{
	background: url(../img/close.png) no-repeat center;
}
.service-sub .buy{
	position: absolute;
	display: inline-block;
	height: 40px;
	width: 150px;
	color: rgb(58,54,87);
	background-color: #fff;
	line-height: 40px;
	text-align: center;
	border-radius: 40px;
	bottom: 5%;
	left: 50%;
	z-index: 999;
}

#section4 .ser4-title{
	margin: 0 auto;
	display: block;
	width: 135px;
	margin: 0 auto;
	font-size: 18px;
	padding: 10px;
}
#section4 .ser4-p{
	font-size: 10px;
	width: 220px;
	margin: 8px auto 0 auto;
}
.section4-box1{
	width: 48%;
	height: 300px;
	float: left;
	margin-top: 15px;
	/*background: url(../img/zhanshi1.png) no-repeat center;
	background-size: 100% auto;*/
}
.section4-box1 img,.section4-box2 img{
	width: 100%;
	height: 300px;
}
.section4-box3 img{
	width: 100%;
	height: auto;
}
.section4-box2{
	/*background: url(../img/zhanshi2.png) no-repeat center;
	background-size: 100% auto;*/
}
.section4-box2,.section4-box3{
	width: 25%;
	height: 300px;
	float: left;
	margin-left: 5px;
	margin-top: 15px;
}

.section4-box3 p{
	width: 90%;
	margin: 25% auto 0 auto;
	font-size: 12px;
}
.section4-box3{position: relative;}
.section4-box3 .pro-btn{
	position: absolute;
	margin-top: 20%;
	right: 0;
	bottom: 0;
}
#section4 .pingpai{
	display: block;
	width: 66px;
	margin: 0 auto;
	font-size: 14px;
	padding: 5px;
	margin-top: 10px;
	border-bottom: 1px solid #777;
}
.logo-boxs{
	margin-top: 10px;
}
.logo-box{
	display: inline-block;
	/*height: 60px;*/
	width: 23%;
	margin-left: 1%;
	text-align: center;
	font-size: 0;
	padding: 12px 0;
}
.logo-box img{
	height: 30px;
	width: 90%;
}
.slider-btn{
	width: 86px;
	height: 27px;
	margin: 10px auto;
}
.slider-btn .prve,.slider-btn .next{
	display: inline-block;
	width: 27px;
	height: 27px;
}
.slider-btn .prve{
	background: url(../img/prve.png) no-repeat center;
}
.slider-btn .next{
	margin-left: 16px;
	background: url(../img/next.png) no-repeat center;
}
/*#section5{height: 150%;border-bottom: 2px solid #f00;}*/
.section5{
	width: 70%;
	height: 100%;
	margin: 0 auto;
}
.ser5-title{
	display: block;
	width: 190px;
	font-size: 18px;
	margin: 0 auto;
	padding-top: 90px;
	position: relative;
}
.ser5-title:after{
	content: "";
	position: absolute;
	width: 120px;
	left: 35px;
	top: 120px;
	border-bottom: 2px solid #777;
}
.ser5-p{
	width: 220px;
	font-size: 10px;
	margin: 8px auto 0 auto;
	padding-top: 5px;
}
.sec5-box{
	width: 33.3%;
	float: left;
	height: 200px;
	margin-top: 5%;
	text-align: center;
	border: 1px solid #000;
}
.sec5-box img{
	display: inline-block;
	margin-top: 20px;
}
.sec5-box span{
	display: inline-block;
	margin-top: 30px;
}
.form-section{
	margin-top: 5%;
}
.form-section form li{
	width: 25%;
    float: left;
    margin-right: 8%;
    border-bottom: 1px solid #e8e8e8;
}
.form-section form li:last-child{
	width: 97%;
	margin-top: 20px;
	margin-bottom: 35px;
}
.form-section input{
	height: 36px;
	outline: none;
	border:none;
}
.sub-btn{
	display: block;
	width: 100px;
	margin: 0 auto; 
	background: #fff;
	margin-top: 35px;
	border: 1px solid #e8e8e8;
	padding: 8px 12px;
}
.foot{
	width: 70%;
	margin: 0 auto;
	height: 400px;
}
.footer{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 400px;
	margin-top: 30%;
	background: rgb(54,49,103);
}
.footer-left img{
	margin-top: 30px;
}
.footer-right{
	height: 300px;
	width: 70%;
	margin-top: 50px;

}
.foot-li{
	margin-left: 30px;
}
.foot-li-title{
	color: rgba(255,255,255,.8);
	font-size: 18px;
}
body .foot-li li{
	margin-top: 10px;
}
body .foot-li li a{
	color: rgba(255,255,255,.6);
	font-size: 14px;
}
.copy{
	position: absolute;
	width: 100%;
	height: 55px;
	line-height: 55px;
	color: #fff;
	text-align: center;
	bottom: 0;
	background: rgb(22,19,47);
}

@media only screen and (min-width: 1920px){
	#section2 .pro-title{
		padding: 15px;
	}

	.pro-btn{
		margin-top: 40px;
	}
	.pro-li{
		margin-top: 90px;
	}
	.swich{
		margin-top: 110px;
	}
	.service-li{
		height: 350px;
	}
	.section4-box1,.section4-box2,.section4-box3{
		height: 380px;
		margin-top: 35px;
	}
	.section4-box1 img,.section4-box2 img{
		height: 380px;
	}
	.section4-box2, .section4-box3{
		margin-top: 35px;
	}
	#section4 .pingpai,#section4 .logo-boxs,#section4 .slider-btn{
		margin-top: 40px;
	}
	.albor img{
		width: 75%;
	}
	.ser5-p{
		width: 240px;
		margin-top: 15px;
	}
	.sec5-box{
		height: 240px;
		margin-top: 60px;
	}
	.form-section{
		margin-top:120px;
	}
	.form-section form li:last-child{
		margin-top: 50px;
	}
	.sub-btn{
		margin-top: 95px;
	}
	.foot-li{
		margin-left: 50px;
	}
}